import { computed, reactive, Ref, ref, watch,getCurrentInstance } from 'vue';
import { useStore } from 'vuex';
import { useRoute } from 'vue-router';
import { CURRENT_FACTORY } from '@/store/modules/user/mutations';
import { UserInfo } from '@/api/system/core/typing';

export interface FactorySelectProp {
  disabled: boolean,
  factoryList: [],
  factory: string,
  handleChange: Function,
  disableOption: Function,
};

export const FactorySelectSymbol = 'proGlobalFactorySelect';
export const useFactorySelect = () => {
  // 禁用状态
  const disabled = ref<boolean>(true);
  // 工厂数据源
  const factoryList = ref<object[]>([]);
  // 现行选中项
  const factory = ref<string>('');
  // Vuex
  const store = useStore();


  /**
   * 数据源中禁用路由工厂不存在的选项
   * @param factoryList 工厂数据源
   * @param routeFactory 路由工厂数据集
   */
  const disableOption = (factoryList: Ref<object[]>, routeFactory: string[]): void => {
    factoryList.value.forEach((item: any) => {
      item.disabled = routeFactory.filter((f: string) => f === item.code).length === 0;
    });
  }
  /**
   * 选择框选择事件
   * @param value 选中的值
   */
  const handleChange = (value: string) => {
    // 提交vuex，改变当前工厂
    store.commit(`user/${CURRENT_FACTORY}`, value);
    if(factory.value=='1400100'
        ||factory.value=='1400200'
        ||factory.value=='1400300'
        ||factory.value=='1400400'
        ||factory.value=='1400500'){
      proxy.decimalDeal.decimalDeal=4
    }else{
      proxy.decimalDeal.decimalDeal=3
    }
  }
  /**
   * 更新工厂数据源
   */
  const updateFactoryList = (): void => {
    const userState = reactive({
      currentUser: computed(() => store.getters['user/user'])
    });
    watch(() => userState.currentUser, (user: UserInfo) => {
      // 从当前用户获取工厂数据集
      if(user && user.factoryList) {
        factoryList.value = []
        user.factoryList.forEach((item: any) => {
          factoryList.value.push({
            code: item.code,
            name: item.name,
            disabled: false
          });
        });
      }
    });
  }
  updateFactoryList();

  const route = useRoute();
  const gettingState = reactive({
    multiFactoryChange: computed(() => store.getters['user/multiFactoryChange']),
    currentFactory: computed(() => store.getters['user/currentFactory']),
  });
  // 监听页签选择工厂变化
  const {proxy}:any=getCurrentInstance()
  watch(() => gettingState.multiFactoryChange, (value: number) => {
    if(value === -1) {
      // 禁用
      disabled.value = true;
    } else {
      disabled.value = false;
      factory.value = gettingState.currentFactory;
      disableOption(factoryList, route.meta.factorys as string[]);
      if(factory.value=='1400100'
          ||factory.value=='1400200'
          ||factory.value=='1400300'
          ||factory.value=='1400400'
          ||factory.value=='1400500'){
        proxy.decimalDeal.decimalDeal=4
      }else{
        proxy.decimalDeal.decimalDeal=3
      }
    }
  });
  return {
    disabled,
    factoryList,
    factory,
    handleChange,
    disableOption,
  }
}
